<template>
  <div class="myContainer">
    <el-row class="myPaddingTop_10px">
      <el-col :span="24">
        <el-row class="myBorderBottom myMarginBottom_10px">
          <el-col :span="7" class="myTitleText">{{title}}</el-col>
        </el-row>

        <el-row class="myPaddingBottom_10px">
          <el-col :span="3" class="myLeftMsg">
            考核类型 :
          </el-col>
          <el-col :span="6">
            <el-input placeholder="考核类型" v-model="list.type_name" :readonly="readonly"></el-input>
          </el-col>
        </el-row>

        <el-row class="myPaddingBottom_10px">
          <el-col :span="3" class="myLeftMsg">
            标准代码 :
          </el-col>
          <el-col :span="6">
            <el-input placeholder="标准代码" v-model="list.st_no" :readonly="readonly"></el-input>
          </el-col>
        </el-row>

        <el-row class="myPaddingBottom_10px">
          <el-col :span="3" class="myLeftMsg">
            考核内容 :
          </el-col>
          <el-col :span="12">
            <el-input placeholder="考核内容" type="textarea" v-model="list.st_content" :readonly="readonly"></el-input>
          </el-col>
        </el-row>

        <el-row class="myPaddingBottom_10px">
          <el-col :span="3" class="myLeftMsg">
            考核标准 :
          </el-col>
          <el-col :span="12">
            <el-input placeholder="考核标准" type="textarea" v-model="list.st_info" :readonly="readonly"></el-input>
          </el-col>
        </el-row>

        <el-row class="myPaddingBottom_10px">
          <el-col :span="3" class="myLeftMsg">
            重点考核 :
          </el-col>
          <el-col :span="12">
            <el-input placeholder="重点考核" type="textarea" v-model="list.detail_focus" :readonly="readonly"></el-input>
          </el-col>
        </el-row>

        <el-row class="myPaddingBottom_10px">
          <el-col :span="3" class="myLeftMsg">
            是否必检 :
          </el-col>
          <el-col :span="6">
            <el-input placeholder="是否必检" v-model="type_name" :readonly="readonly"></el-input>
          </el-col>
        </el-row>

        <el-row class="myPaddingBottom_10px">
          <el-col :span="3" class="myLeftMsg">
            考核结论 :
          </el-col>
          <el-col :span="6">
            <el-input placeholder="考核结论" v-model="detail_result" :readonly="readonly"></el-input>
          </el-col>
        </el-row>

        <el-row class="myPaddingBottom_10px">
          <el-col :span="3" class="myLeftMsg">
            现场图片 :
          </el-col>
          <el-col :span="20" v-if="list.detail_img!='' && list.detail_img!=undefined">
            <img :src=x width="150" v-for="x in list.detail_img.split(',')" style="margin-right: 10px;"/>
          </el-col>
        </el-row>

        <el-row class="myPaddingBottom_10px">
          <el-col :span="3" class="myLeftMsg">
            文字说明 :
          </el-col>
          <el-col :span="12">
            <el-input placeholder="文字说明" type="textarea" v-model="list.detail_info" :readonly="readonly"></el-input>
          </el-col>
        </el-row>

        <el-row class="myPaddingBottom_10px">
          <el-col :span="3" class="myLeftMsg">
            详细地址 :
          </el-col>
          <el-col :span="12">
            <el-input placeholder="详细地址" type="textarea" v-model="list.detail_address" :readonly="readonly"></el-input>
          </el-col>
        </el-row>

        <el-row class="myPaddingBottom_10px">
          <el-col :span="6" :offset="3">
            <el-button type="primary" class="myBgGreen" @click="onBack">返 回</el-button>
          </el-col>
        </el-row>
      </el-col>
    </el-row> 
  </div> 
</template>

<style scoped>
  .myBorderBottom{
    border-bottom:1px dotted #dbdbdb;
    padding-bottom: 5px;
  }
  .myMarginBottom_10px{
    margin-bottom: 10px;
  }
  .myContainer{
    background: #fff;
    padding: 10px;
  }
  .myLeftMsg{
    line-height: 40px;
    text-align: right;
    padding-right: 10px;
  }
  .myPaddingBottom_10px{
    padding-bottom: 10px;
  }
  .myVA_M{
    vertical-align: middle;
  }
  .myBgGreen{
    background: #00c2a9;
    border-color: #00c2a9;
    color: #fff;
    margin-top: 2px;
  }
  .myBgGreen:hover{
    background: #33ceba;
  }
  .myLineHeight_45px{
    line-height: 45px;    
  }
  .mymarginTop_10px{
    margin-top: 10px;
  }
  .myDialogSearchText{
    width: 360px;
  }  
  .myPaddingTop_10px{
    padding-top: 10px;
  }
  .myLeftMsg{
    line-height: 40px;
    text-align: right;
    padding-right: 10px;
  }   
</style>

<script>
  import { infoDetailMainTask } from '@/api/quality';
  export default {
    data(){
      return{
        title:"考核标准详细",
        tableData:[], 
        list:[],
        loading:false,
        readonly:true,  
        id:"",
        type:"",
        type_name:"",
        detail_result:"",
        taskid:""
      }
    },
    components: {
        
    },
    filters:{ 
    },
    created(){
      this.id = this.$route.query.id;
      this.type=this.$route.query.type;
      this.taskid=this.$route.query.taskid;
      if(this.type=="info"){
        this.oninfoDetailMainTask();
      }
    },
    mounted(){
      document.title = this.title;
      
    },
    methods:{     
      search(){

      },
      onBack(){
        this.$router.push({
          path:"supervisoryTaskComonents",
          query:{
            flag:"second",
            type:"info",
            id:this.taskid
          }
        })
      },
      oninfoDetailMainTask(){
        let vm=this;
        infoDetailMainTask(vm.id).then(response => {
          let res=response.data;
          vm.list=res;
          vm.type_name=vm.necessary(res.is_necessary);
          vm.detail_result=vm.detailresult(res.detail_result);
        }).catch(error => {
          vm.$message.error("执行失败！"+error.response.data.error_msg);
        })
      },
      necessary(val){
        let type={
          "0":"否",
          "1":"是", 
        }
        return type[val];
      },
      detailresult(val){
        let type={
          "0":"合格",
          "1":"不合格", 
        }
        return type[val];
      },

    }
    
  }   


</script>



